import React, { Component } from 'react';
import qs from 'qs';
import autoBind from 'react-autobind';
import { connect } from 'dva';

// widget 
import SearchNav from '../components/Common/SearchNav'
import SearchResult from '../components/Search/SearchResult'

class SearchPage extends Component {
	constructor(props) {
        super(props)
        autoBind(this)

        this.state = {
        	keywords: ''
        }
    }
    componentDidMount() {
    	const { location } = this.props
        let searchParam = location.search.replace('?', '')
        searchParam = qs.parse(searchParam)

        if(searchParam.searchKey) {
        	this.setState({
        		keywords: searchParam.searchKey
        	})
        }
    }
	changeSearchKeywords(keywords) {
		this.setState({
			keywords
		})
	}
	render() {
		return (
		  	<div>
		    	<SearchNav 
		    		keywords={this.state.keywords}
		    		changeSearchKeywords={this.changeSearchKeywords} 
		    		{...this.props} />
		    	<SearchResult keywords={this.state.keywords} {...this.props} />
		    </div>
		);
	}
}

SearchPage.propTypes = {
};

export default connect(({ meyley }) => ({
	meyley
}))(SearchPage);
